<template>
  <tab-bar>
    <tab-bar-item link="/home" activeColor="red">
      <img slot="item_icon" src="~assets/img/tabbar/icon01.png" alt="home">
      <img slot="item_icon_active" src="~assets/img/tabbar/icon01_active.png" alt="home_active">
      <div slot="item_text">首页</div>
    </tab-bar-item>
    <tab-bar-item link="/category" activeColor="red">
      <img slot="item_icon" src="~assets/img/tabbar/icon02.png" alt="category">
      <img slot="item_icon_active" src="~assets/img/tabbar/icon02_active.png" alt="category_active">
      <div slot="item_text">分类</div>
    </tab-bar-item>
    <tab-bar-item link="/shopcar" activeColor="red">
      <img slot="item_icon" src="~assets/img/tabbar/icon03.png" alt="shopcar">
      <img slot="item_icon_active" src="~assets/img/tabbar/icon03_active.png" alt="shopcar_active">
      <div slot="item_text">购物车</div>
    </tab-bar-item>
    <tab-bar-item link="/myself" activeColor="red">
      <img slot="item_icon" src="~assets/img/tabbar/icon04.png" alt="myself">
      <img slot="item_icon_active" src="~assets/img/tabbar/icon04_active.png" alt="myself_active">
      <div slot="item_text">我的</div>
    </tab-bar-item>
  </tab-bar>
</template>
<script>
import TabBar from 'components/common/tabbar/TabBar.vue'
import TabBarItem from 'components/common/tabbar/TabBarItem.vue'
export default {
  components: { TabBar, TabBarItem },
  name: 'MainTabBar'
}
</script>
